<nz-collapseset>
  <nz-collapse [nzTitle]="panels.name" [nzActive]="panels.active" [nzDisabled]="panels.disabled">
    <form nz-form>
      <div nz-form-item nz-row style="margin-bottom: 12px">
        <div nz-form-label nz-col  [nzSpan]="2">
          <label>使用单位</label>
        </div>
        <div nz-form-control nz-col [nzSpan]="3">
          <nz-input [(ngModel)]="demandMaintenance.userPartyName" name="planName">
          </nz-input>
        </div>

        <div nz-form-label nz-col  [nzSpan]="2">
          <label>维保单位</label>
        </div>
        <div nz-form-control nz-col [nzSpan]="3">
          <nz-input [(ngModel)]="demandMaintenance.maintenancePartyName" name="planName">
          </nz-input>
        </div>

        <div nz-form-label nz-col [nzSpan]="2">
          <label>实施时间</label>
        </div>
        <div nz-form-control nz-col [nzSpan]="7" >
          <nz-datepicker [nzSize]="'large'" [nzFormat]="'YYYY-MM-DD'" name="startDate" [nzPlaceHolder]="'开始日期'" [(ngModel)]="demandMaintenance.startDate"></nz-datepicker>
          ~
          <nz-datepicker [nzSize]="'large'" [nzFormat]="'YYYY-MM-DD'" name="endDate" [nzPlaceHolder]="'结束日期'" [(ngModel)]="demandMaintenance.endDate"></nz-datepicker>
        </div>

        <button [nzSize]="'large'" nz-button  [nzType]="'primary'" (click)="query()">查询</button>
      </div>
    </form>
  </nz-collapse>
</nz-collapseset>
<div>


  <nz-table #nzTable [nzDataSource]="dataList" nzSize="middle" [nzBordered]="true" [nzIsPagination]="false" (nzDataChange)="displayDataChange($event)">
    <thead nz-thead>
    <tr>
      <th nz-th [nzCheckbox]="true">
        <label nz-checkbox [(ngModel)]="allChecked" [nzIndeterminate]="indeterminate" (ngModelChange)="checkAll($event)">
        </label>
      </th>
      <th nz-th>
        <span>使用单位</span>
      </th>
      <th nz-th>
        <span>维保单位</span>
      </th>
      <th nz-th>
        <span>保险单位</span>
      </th>
      <th nz-th>
        <span>保险到期时间</span>
      </th>
      <th nz-th>
        <span>申请维保周期</span>
      </th>
      <th nz-th>
        <span>实施时间</span>
      </th>
      <th nz-th>
        <span>申请状态</span>
      </th>
      <th nz-th>
        <span>其他说明</span>
      </th>
      <th nz-th>
        <span>电梯详情</span>
      </th>
      <th nz-th>
        <span>下载文件</span>
      </th>
      <th nz-th *ngIf="isShowButton">
        <span>操作</span>
      </th>
      <th nz-th>
        <span>审批意见</span>
      </th>
    </tr>

    </thead>
    <tbody nz-tbody>
    <tr nz-tbody-tr *ngFor="let data of dataList">
      <td nz-td [nzCheckbox]="true">
        <label nz-checkbox [nzDisabled]="data.disabled" [(ngModel)]="data.checked" (ngModelChange)="refreshStatus($event)">
        </label>
      </td>
      <td nz-td>{{data.userPartyName}}</td>
      <td nz-td>{{data.maintenancePartyName}}</td>
      <td nz-td>{{data.insuranceName}}</td>
      <td nz-td>{{data.insuranceDate}}</td>
      <td nz-td>{{data.maintenanceCycle}}</td>
      <td nz-td>{{(data.startDate | dateFormat)}} ~ {{(data.endDate | dateFormat)}}</td>
      <td nz-td>{{data.applyStatus | constantTransfer:applyStatus}}</td>
      <td nz-td>{{data.otherNotes}}</td>
      <td nz-td>
        <button nz-button  [nzSize]="'small'" [nzType]="'primary'" (click)="detail(data)">查看</button>
      </td>
      <td nz-td>
        <span>
          <nz-popover [nzTitle]="'请选择'" [nzPlacement]="'bottom'" [nzTrigger]="'click'">
              <button nz-button [nzSize]="'small'" [nzType]="'primary'" nz-popover>下载</button>
              <ng-template #nzTemplate>
                  <div style="margin-top:10px">
                      <button nz-button [nzSize]="'small'" (click)="downloadFile(data,2)">承诺书</button>
                  </div>
                  <div>
                      <button nz-button [nzSize]="'small'" (click)="downloadFile(data,1)">维保服务申明</button>
                  </div>
              </ng-template>
          </nz-popover>
        </span>
      </td>
      <td nz-td *ngIf="isShowButton">
        <button nz-button *ngIf="data.applyStatus == '1'" [nzSize]="'small'" [nzType]="'primary'" (click)="showDetail(title,content,footer,data)">审批</button>
        <span *ngIf="data.applyStatus != '1' && data.applyStatus !='2'">
          <button nz-button  [nzSize]="'small'" [nzType]="'primary'" [disabled]="true" (click)="isSuspend(data)">中止</button>
        </span>
        <button nz-button *ngIf="data.applyStatus == '2'" [nzSize]="'small'" [nzType]="'primary'" (click)="isSuspend(data)">中止</button>
      </td>
      <td nz-td>{{data.remarks}}</td>
    </tr>
    </tbody>
  </nz-table>

  <nz-pagination [nzPageIndex]="demandMaintenance.currentPage" nzShowTotal [nzTotal]="total" nzShowSizeChanger
                 (nzPageSizeChange)="nzPageSizeChange($event)" (nzPageIndexChange)="nzPageIndexChange($event)"
                 (nzPageIndexClickChange)="nzPageIndexClickChange($event)" [nzPageSize]="demandMaintenance.pageSize"></nz-pagination>

</div>

<!--按需维保审批 -->
<nz-modal>
  <ng-template #title>
    <span>{{modelTitle}}</span>
  </ng-template>
  <ng-template #content>
    <form>
      <div nz-form-item nz-row>
        <div nz-form-label nz-col [nzSpan]="9" *ngIf="showFlag">
          <label>审批状态</label>
        </div>
        <div nz-form-label nz-col [nzSpan]="9" *ngIf="!showFlag">
          <label>审批</label>
        </div>
        <div nz-form-control nz-col [nzSpan]="8" nzHasFeedback>
          <!--状态展示 1 申请中 2 审核通过 3 审核拒绝 -->
          <nz-radio-group [(ngModel)]="tempBean.applyStatus" name="status" *ngIf="showFlag">
            <label nz-radio [nzValue]="'1'" [nzDisabled]="true">
              <span>申请中</span>
            </label>
            <label nz-radio [nzValue]="'2'" [nzDisabled]="true">
              <span>审核通过</span>
            </label>
            <label nz-radio [nzValue]="'3'" [nzDisabled]="true">
              <span>审核拒绝</span>
            </label>
          </nz-radio-group>

          <!--审批意见 1 申请中 2 审核通过 3 审核拒绝 -->
          <nz-radio-group [(ngModel)]="tempBean.applyStatus" name="status" *ngIf="!showFlag">
            <label nz-radio [nzValue]="'2'" [nzDisabled]="false">
              <span>通过</span>
            </label>
            <label nz-radio [nzValue]="'3'" [nzDisabled]="false">
              <span>拒绝</span>
            </label>
          </nz-radio-group>
        </div>
      </div>
      <div nz-form-item nz-row>
        <div nz-form-label nz-col [nzSpan]="9">
          <label>审批意见</label>
        </div>
        <div nz-form-control nz-col [nzSpan]="8" nzHasFeedback>
          <nz-input [(ngModel)]="tempBean.remarks" [nzType]="'textarea'" [nzRows]="'4'" [nzPlaceHolder]="''"
                    name="remarks" [nzDisabled]="showFlag"></nz-input>
        </div>
      </div>
      <div nz-form-item nz-row *ngIf="!showFlag">
        <div nz-col [nzSpan]="10"></div>
        <div nz-col [nzSpan]="3">
          <button nz-button [nzType]="'primary'" [nzSize]="'large'" (click)="quit()">
            关 闭
          </button>
        </div>
        <div nz-col [nzSpan]="3">
          <button nz-button [nzType]="'primary'" [nzSize]="'large'" (click)="submit()">
            提 交
          </button>
        </div>
      </div>
      <div nz-form-item nz-row *ngIf="showFlag">
        <div nz-col [nzSpan]="12"></div>
        <div nz-col [nzSpan]="3">
          <button nz-button [nzType]="'primary'" [nzSize]="'large'" (click)="quit()">
            关 闭
          </button>
        </div>
      </div>
    </form>
  </ng-template>
  <ng-template #footer>
    <div>
    </div>
  </ng-template>
</nz-modal>
